
page {
  height:100%;
}
#store-cart {
  position: relative;
  height:100%;
  .searchPannel{
    position:absolute;
    left:0;
    top:0;
    transform:translate(100%,0);
    z-index: 10;
    width:100%;
    height:100%;
    background:#ffffff;



    .history-box{
      padding-top: 45px;
      .keywords{
        padding: 0 8px 0 8px;
        height: 40px;
        display: flex;
        align-items: center;
        justify-content: space-between;

        .name{
          flex: 1;
        }
        .clear{
          width: 50px;
          text-align: center;
        }
      }
      .clear-all{
        background-color: #f0f0f1;
        text-align: center;
        color: #6baccf;
        height: 40px;
        line-height: 40px;
      }
    }
  }
  .search {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 44px;
    background: #1aad19;
    padding: 7px 10px;
    filter:blur(20);
    z-index:10;
    image {

      width:23px;
      height:23px;

    }

    text,image {
      position:absolute;
      right:10px;
      top:10px;
    }
    .search_box {
      position: relative;
      margin-right:40px;
      height: 30px;
      background: #ffffff;
      border-radius: 5px;
      padding: 0 10px;

      input {
        height:100%;
        padding-left:15px;
      }

      icon {
        position: absolute;
        top: 5px;
        left: 8px;
        z-index: 5;
      }
    }
  }

  .padding44 {
    height:100%;
    overflow: auto;
    padding-bottom:44px;
  }
  //.goods-box {
  //  padding-top:44px;
  //  padding-bottom: 50px;
  //  .goods-item {
  //    position: relative;
  //    display: flex;
  //    padding: 10px;
  //    background: #FFFFFF;
  //    font-size: 12px;
  //    align-items: center;
  //
  //    .input {
  //
  //    }
  //
  //    .img-box {
  //      image {
  //        display: block;
  //        width: 80px;
  //        height: 80px;
  //        border: 1px solid #e5e5e5;
  //      }
  //    }
  //
  //    .delete {
  //      position: absolute;
  //      right: 0;
  //      top: 0;
  //      width: 66px;
  //      height: 100%;
  //      background: #e73237;
  //      line-height: 102px;
  //      text-align: center;
  //      color: #ffffff;
  //      font-size: 13px;
  //      border-radius: 0;
  //      white-space: nowrap;
  //
  //    }
  //    .edit-tools {
  //      flex: 1;
  //      margin-left:20px;
  //      overflow: hidden;
  //      height: 82px;
  //      display: flex;
  //      justify-content: space-around;
  //      flex-direction: column;
  //      color: #959595;
  //      > view {
  //        flex: 1;
  //        display: flex;
  //        flex-direction: row;
  //        align-items: center;
  //      }
  //      .size-value {
  //        display: inline-block;
  //        height: 30px;
  //        width: 94px;
  //        margin-left:20px;
  //        .size-input {
  //          box-sizing: border-box;
  //          display: inline-block;
  //          border: 1px solid #e7e7e7;
  //          height: 100%;
  //          width: 100%;
  //          text-align: center;
  //          outline: none;
  //
  //        }
  //      }
  //
  //      .change-num {
  //        position:relative;
  //        margin-left:20px;
  //        flex: 1;
  //
  //
  //
  //        ul {
  //          display: flex;
  //
  //          li {
  //            display: block;
  //            list-style: none;
  //            width: 30px;
  //            height: 30px;
  //            border: 1px solid #e8e8e8;
  //            text-align: center;
  //            line-height: 30px;
  //
  //            &:nth-child(2) {
  //              border-left: none;
  //              border-right: none;
  //            }
  //            input {
  //              display: block;
  //              border: none;
  //              height: 100%;
  //              width: 100%;
  //              text-align: center;
  //              outline: none;
  //              color:#000;
  //            }
  //          }
  //        }
  //      }
  //    }
  //
  //
  //    .item-info {
  //      margin-left: 10px;
  //      line-height: 20px;
  //      flex: 1;
  //      overflow: hidden;
  //      text-overflow: ellipsis;
  //
  //      .name {
  //        font-size: 14px;
  //
  //        padding-bottom: 5px;
  //        overflow: hidden;
  //        text-overflow: ellipsis;
  //        display: -webkit-box;
  //        -webkit-line-clamp: 2;
  //        -webkit-box-orient: vertical;
  //
  //      }
  //
  //      .choose {
  //        display: flex;
  //        flex-direction: row;
  //        justify-content: space-between;
  //        align-items: center;
  //
  //        .money-box {
  //          position: relative;
  //          flex: 1;
  //          display: flex;
  //          color: #838383;
  //          flex-direction: column;
  //
  //          .del {
  //            position: absolute;
  //            bottom:0;
  //            right:5%;
  //            width: 15px;
  //            height: 15px;
  //
  //          }
  //
  //          .edit {
  //            position: absolute;
  //            bottom:0;
  //            right:15%;
  //            width: 15px;
  //            height: 15px;
  //
  //          }
  //          .model {
  //            flex: 1;
  //            font-size: 13px;
  //            .price {
  //              text-space: 0;
  //              color: #e40013;
  //
  //            }
  //
  //          }
  //
  //          .money {
  //
  //          }
  //        }
  //      }
  //    }
  //  }
  //}
  .buy-box {
    display: flex;
    align-items: center;
    position: fixed;
    bottom: 0;
    width: 100%;
    height: 50px;
    line-height: 50px;
    font-size: 15px;
    background: #FFFFFF;
    z-index: 10;
    .money-box {
      padding-left: 10px;
      flex: 1;
    }
    .num-box {
      height: 100%;
      width: 110px;
      text-align: center;
      color: #FFFFFF;
      border-radius: 0;
      background: #1aad19;
    }
  }
}

.select_goods_container {
  background: #ffffff;
  position: relative;
  z-index:100;

  .select_goods_cloese {

    position: absolute;
    top:12px;
    right:10px;
    width:20px;
    height:20px;
    background: transparent;
    z-index:4;

  }

  .select_goods_cloese:before{
    position: absolute;
    top:9px;
    left:-1px;
    content: '';
    width:28px;
    height:2px;
    background: #2e2e2e;
    transform: rotate(45deg) ;


  }

  .select_goods_cloese:after{
    top:9px;
    left:-1px;
    position: absolute;
    content: '';
    width:28px;
    height:2px;
    background: #2e2e2e;
    transform: rotate(-45deg);


  }

  .select_goods_header{
    display: flex;
    padding: 8px;
    align-items: center;

    .img_box {

      width:78px;
      height:78px;
      border:1px solid #e5e5e5;
      background:#f9f9f9 ;
      overflow: hidden;

      image {
        object-fit: fill;
        width:100%;
        height:100%;
      }
    }


    .price_item {
      font-size:18px;
      margin-left:20px;
      height:100%;
      display:-webkit-flex;
      flex-direction: column;
      justify-content: center;

      text {
        display: block;
        text-align: left;
      }

      text:nth-child(1){
        font-weight:bold;
        color:#ee2b1d;
      }

      text:nth-child(2){
        font-size:14px;
        color:#6c6c6c;
        text-indent:3px
      }
    }

  }

  .select_spec {
    font-size: 12px;
    padding: 12px 8px 50px 8px;

    .spec_line {
      display: flex;
      margin-bottom: 15px;

      .spec_title {
        padding-right: 11px;
        color: #c4c4c4;
        width: 100px;
        line-height: 35px;
      }


      .spec_list  {
        display: block;
        line-height:35px;
        color:#959595;
        font-size:15px;
      }

      .spec_block {
        display: inline-block;
        margin-top: 10px;
        margin-right: 10px;

        .spec_text {
          display: block;
          padding: 0 7px;
          height: 33px;
          line-height: 33px;
          min-width: 20px;
          border: 1px solid #DDDDDD;
          text-align: center;
          font-size: 12px;
          position: relative;
        }

        image {
          height: 100%;
          width: 100%;
        }

        .spec_icon {
          height: 35px;
          padding: 0 2px;
        }

        &.active text {
          &:before {
            content: '';
            position: absolute;
            border: 3px solid #179b16;
            top: -1px;
            left: -1px;
            right: -1px;
            bottom: -1px;
          }
        }

        &.disabled text {
          border: none;
          margin: 1px;

          &:before {
            content: '';
            position: absolute;
            background-color: #eee;
            top: -1px;
            left: -1px;
            right: -1px;
            bottom: -1px;
            opacity: 0.6;
          }

          &:after {
            content: '';
            position: absolute;
            border: 3px dashed #cfcfcf;
            top: -1px;
            left: -1px;
            right: -1px;
            bottom: -1px;
          }
        }
      }

      .num_title {
        padding-right: 11px;
        color: #c4c4c4;
        width: 100px;
        line-height: 30px;
      }

      .num_value {
        display: flex;
        font-size: 0;

        text {
          display: block;
          border: 1px solid #e8e8e8;
          text-align: center;
          min-width: 28px;
          width: 28px;
          height: 28px;
          line-height: 28px;
          font-size: 12px;

          &.store {
            width: auto;
            border-color: #ffffff;
            margin-left: 10px;
          }
        }

        input {
          display: block;
          border: none;
          height: 100%;
          width: 100%;
          text-align: center;
          outline: none;
          font-size: 12px;
        }

        .none_border {
          width: 30px;
          border:1px solid #e8e8e8;
          border-left: none;
          border-right: none;
        }
      }
    }
  }

}
.pop-black {
  opacity:0;
  position: fixed;
  top:0;
  left:0;
  right:0;
  bottom:0;
  width:100%;
  height:100%;
  background: rgb(0,0,0);
  z-index:10;
}
//.detail-popup  {
//
//  width:100%;
//  position: fixed;
//  left: 0;
//  bottom: -55px;
//  z-index: 99;
//  transform:translate3d(0,100%,0);
//
//  /*选取规格部分*/
//  .select_spec {
//    background: #fff;
//    font-size: 12px;
//    padding: 12px 8px 50px 8px;
//
//    .spec_line {
//      display: flex;
//      margin-bottom: 15px;
//
//      .spec_title {
//        padding-right: 11px;
//        color: #c4c4c4;
//        width: 100px;
//        line-height: 35px;
//      }
//      .spec_list  {
//        display: block;
//        line-height:35px;
//        color:#959595;
//        font-size:15px;
//      }
//
//      .spec_value {
//        flex: 1;
//        font-size: 0;
//        margin-top: -10px;
//
//        view{
//          overflow: hidden;
//        }
//      }
//
//      .spec_block {
//        display: inline-block;
//        margin-top: 10px;
//        margin-right: 10px;
//
//        text {
//          display: block;
//          padding: 0 7px;
//          height: 33px;
//          line-height: 33px;
//          min-width: 20px;
//          border: 1px solid #DDDDDD;
//          text-align: center;
//          font-size: 12px;
//          position: relative;
//        }
//
//        image {
//          height: 100%;
//          width: 100%;
//
//        }
//
//        &.active view {
//          &:before {
//            content: '';
//            position: absolute;
//            border: 3px solid #179b16;
//            top: -1px;
//            left: -1px;
//            right: -1px;
//            bottom: -1px;
//          }
//        }
//
//        &.disabled view {
//          border: none;
//          margin: 1px;
//
//          &:before {
//            content: '';
//            position: absolute;
//            background-color: #eee;
//            top: -1px;
//            left: -1px;
//            right: -1px;
//            bottom: -1px;
//            opacity: 0.6;
//
//          }
//
//          &:after {
//            content: '';
//            position: absolute;
//            border: 3px dashed #cfcfcf;
//            top: -1px;
//            left: -1px;
//            right: -1px;
//            bottom: -1px;
//          }
//        }
//      }
//
//      .num_title {
//        padding-right: 11px;
//        color: #c4c4c4;
//        width: 100px;
//        line-height: 30px;
//      }
//
//      //.num_value {
//      //  display: flex;
//      //  flex: 1;
//      //  font-size: 0;
//      //
//      //  text {
//      //    display: block;
//      //    border: 1px solid #e8e8e8;
//      //    text-align: center;
//      //    min-width: 28px;
//      //    width: 28px;
//      //    height: 28px;
//      //    line-height: 28px;
//      //    font-size: 12px;
//      //
//      //    &.store {
//      //      width: auto;
//      //      border-color: #ffffff;
//      //      margin-left: 10px;
//      //    }
//      //  }
//      //
//      //  input {
//      //    display: block;
//      //    border: none;
//      //    height: 100%;
//      //    width: 100%;
//      //    text-align: center;
//      //    outline: none;
//      //  }
//      //
//      //  .none_border {
//      //    width:50px;
//      //    border-left: none;
//      //    border-right: none;
//      //  }
//      //}
//    }
//
//    .button {
//      height: 50px;
//      line-height: 50px;
//      text-align: center;
//      position: absolute;
//      bottom: 0;
//      left: 0;
//      right: 0;
//      border-radius: 0;
//      &.disabled {
//        background: #C2C2C2;
//      }
//    }
//  }
//}